<template>
  <div class='box-wrap'>
    <section class='box-operation'>
      <div class="box-search">
        <div class='form-group-enquire'><Input v-model.trim="searchData.name" placeholder="日志名称" clearable @on-enter="onSearchGetList()"></Input></div>                 
        <div class='form-group-enquire'>
          <DatePicker type="daterange" placeholder="注册时间" style="width: 190px" :editable=false v-model="searchDate" @on-change="changeDate" @on-clear="initDate"></DatePicker>
        </div>         
        <div class='form-group-img' @click='onSearchGetList()'><img src="../../assets/images/peach-svg/Frame 23.svg"></div>
      </div>
    </section>
    <LibVxeTable class="staticData" :stripe="stripe" border="none" :tableColumns="tableColumns" :tableData="list" :slotHeader="slotHeader" :PageObj="{total:totalCnt,currentPage:searchData.page_index,pageSize:searchData.page_size}"  @onPageChange="onChangePageSize" resizable></LibVxeTable>
  </div>
</template>
<script>
import { mapGetters } from "vuex";
import utils from "../../commons/utils";
import {commonMixin} from "../../components/ViewInitMixin" //每一个文件都要包含这个
import {TimePicker} from "iview"
import SearchUser from "../searchUser"
import Request from "../../commons/Request"

export default {
  name: "addUserDetailView",  //!!这块一定要注意，每一个文件都根据资源path来命名
  components:{TimePicker,SearchUser},
  mixins:[commonMixin],
  data() {
    return {
      stripe:false,      
      modal:false,
      searchDate:"",
      searchTime:[utils.dateFormat(0,"HH")+"00",utils.dateFormat(0,"HH")+"00"],
      searchData:{
        start:"",
        end:"",        
        name:"",        
        page_index:1,
        page_size:30,        
      },
      versionsList:[{Id:-1,Name:'全部版本'},{Id:1,Name:'v1'},{Id:2,Name:'v2'}],
      mnoList:{},
      provinceList:{},
      list:[],
      totalCnt:0,
      info:{},
      channelList:[],
      cityList:[],
      cityInfo:[-1],
      partnerList:[],
      ChannelList:[],
      QdsPartnerList:[],
      QdsPartnerObj:{},
      BusinessList:[],
      BusinessObj:{},
      cityObj:{},
      brandObj:{},
      brandObjCh:{},
      tableColumns:[
        {
          title: "日志名称",
          field: "name",
          align: 'center',
        },
        {
          title: "账户名称",
          field: "login_account",
          align: 'center',
        },
        {
          title: "创建时间",
          field: "login_time",
          align: 'center',
          slots: {
            default: ({row},h) => {
              if(row.login_time == 0){
                return [h("div","--")]
              } else {
                 return [h("div",utils.dateFormat(row.login_time, "yyyy-MM-dd HH:mm:ss"))];
              }
            }
          }
        },
        {
          title: "具体消息",
          field: "msg",
          align: 'center',
        },
        {
          title: "IP",
          field: "ip",
          align: 'center',
        },
      ],
      format: {  

      },
      ruleValidate: {
      },      
      dateOptions:{
        disabledDate(date){
          return date && date.valueOf() > Date.now();
        },

      },
    };
  },
  computed: {
            ...mapGetters(["UserInfo"]),
        },
  methods: {
    async initView(isMounted){
      this.initDate();
      this.getList();
    },
    onSearchGetList(){
      this.searchData.page_index =1;
      this.getList();
    },
    async getList(){
      utils.showLoading()
      let res = await this.RequestPost("query_list",this.searchData);
      if(res.code==0 && res.data != null){
        this.list = [];
        if(res.data.list!=null) this.list = res.data.list;
        this.totalCnt = res.data.total
      }
      await utils.sleepMs(500)
      utils.hideLoading();
    },    
    onChangePageSize(page,pageSize){
      this.modal = true        
      this.searchData.page_index = page;
      this.searchData.page_size = pageSize;
      this.getList();
    },
    changeDate(val){
      this.searchData.start = Date.parse(this.searchDate[0])/1000;
      this.searchData.end = Date.parse(this.searchDate[1])/1000+86400;
      this.onSearchGetList();
    },
    initDate(){
      let beginDay,endDay= "";
      this.searchDate = [new Date(beginDay),new Date(endDay)];
      this.changeDate();
    },
    slotHeader(h) {
      return [h("div",{class:{"allCount":true},"style":{"margin-left":"10px"}})]
    },
  },
};
</script>  